<!-- ExtJS CSS and Libs -->
<script type="text/javascript">
RM = {};
RM.Common = {};
RM.BaseURL = '<?php echo RM_Environment::getInstance()->getRouter()->_(); ?>';
RM.RootURL = '<?php echo RM_Environment::getConnector()->getRootURL(); ?>';
<?php echo $this->_router->getAccembleURLJsCode(); ?>
</script>
<link rel="stylesheet" type="text/css" href="<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/system/js/libs/ext/resources/css/ext-all.css">
<script language="javascript" type='text/javascript' src='<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/system/js/libs/ext/adapter/ext/ext-base.js'></script>
<script type="text/javascript" src="<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/system/js/libs/ext/ext-all.js"></script>
<script type="text/javascript" src="<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/system/js/admin/common.js"></script>
<link rel="stylesheet" type="text/css" href="<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/userdata/plugins/AuthorizeNet/views/user/scripts/AuthorizeNet/authorizenet.css">
<script type="text/javascript">

/**
 * Provides the Form Processing
 *
 */
var processRequest = function(){

    // disable the submit button while processing
    Ext.getDom('submit').disabled = true;
    document.getElementById("RM_payment_processing_message_area").style.display = "block";
    document.getElementById("RM_card_proccessing_error_msg").style.display = "none";
    document.getElementById("RM_cancel_order_msg").style.display = "none";

    // get form values
    var x_card_num = Ext.getDom('x_card_num').value;
    var cc_expire_date_month = Ext.getDom('cc_expire_date_month').value;
    var cc_expire_date_year = Ext.getDom('cc_expire_date_year').value;
    var x_card_code = Ext.getDom('x_card_code').value;

    // basic form validation
    if (x_card_num=="") RM.Common.Message.msg(
        '<?php echo $this->_translate->_('User.AuthorizeNet.Main','Error');?>',
        '<?php echo $this->_translate->_('User.AuthorizeNet.Main','CardNumberNotEntered');?>',
        3,
        "RM_popup_msg_div"
    );

    // build the request...
    var request = {
        url: RM.Common.AssembleURL({
            controller : 'AuthorizeNet',
            action: 'processJson',
            parameters : [{
                name : 'x_card_num',
                value : x_card_num
            },{
                name : 'cc_expire_date_month',
                value : cc_expire_date_month
            },{
                name : 'cc_expire_date_year',
                value : cc_expire_date_year
            },{
                name : 'x_card_code',
                value : x_card_code
            }]
        }),
        method: 'POST',
        success: function(responseObject) {
            // process the return data...
            var returnData = Ext.util.JSON.decode(responseObject.responseText);

            if (returnData.success === true){
                // if successful goto the complete reservation page. This is only 
                // a forward, the reservation processing has already been complete at this stage
                window.location='<?php echo RM_Environment::getInstance()->getRouter()->_('AuthorizeNet', 'success'); ?>';
            } else {
                // if the response is failed, then present a message...

                // hide the processing message
                document.getElementById("RM_payment_processing_message_area").style.display = "none";

                // show the error...
                Ext.getDom('RM_card_proccessing_error_msg').innerHTML = returnData.msg + "(" + returnData.responsecode + ")";

                // show the error and cancel link
                document.getElementById("RM_card_proccessing_error_msg").style.display = "block";
                document.getElementById("RM_cancel_order_msg").style.display = "block";

                // enable the button so the payment can be retried..
                Ext.getDom('submit').disabled = false;
            }
        }
    };
    // use extjs for the ajax request...
    var conn = new Ext.data.Connection();
    conn.request(request);
};
</script>

<div id="RM_popup_msg_div"><!--message anchor here--></div>
<h1><?php echo $this->_translate->_('User.AuthorizeNet.Main','PayNowAuthorizeNet');?></h1>
<br/>
<table width="80%" border="0" align="center" cellpadding="4">
  <tr>
    <td width="50%"><?php echo $this->_translate->_('User.AuthorizeNet.Main','CreditCardNumber');?></td>
    <td nowrap><input id="x_card_num" name='x_card_num' type='text' value='' size="30">
    &nbsp;&nbsp;<img src="<?php echo RM_Environment::getConnector()->getRootURL(); ?>/RM/userdata/plugins/AuthorizeNet/views/user/scripts/AuthorizeNet/authorizenet_icon.gif" border="0">
    </td>
  </tr>
  <tr>
    <td width="50%"><?php echo $this->_translate->_('User.AuthorizeNet.Main','ExpiryDate');?></td>
    <td>
        <select id="cc_expire_date_month" name="cc_expire_date_month">
          <?php foreach ($this->months as $month) { ?>
          <option value="<?php echo $month['value']; ?>"><?php echo $month['text']; ?></option>
          <?php } ?>
        </select>
        /
        <select id="cc_expire_date_year" name="cc_expire_date_year">
          <?php foreach ($this->year_expire as $year) { ?>
          <option value="<?php echo $year['value']; ?>"><?php echo $year['text']; ?></option>
          <?php } ?>
        </select>
    </td>
  </tr>
  <tr>
    <td width="50%"><?php echo $this->_translate->_('User.AuthorizeNet.Main','SecurityCode');?></td>
    <td><input id="x_card_code" name='x_card_code' type='text' value='' size="5">
    <?php echo $this->_translate->_('User.AuthorizeNet.Main','SecurityCodeHelper');?></td>
  </tr>
  <tr>
    <td width="50%">&nbsp;</td>
    <td></td>
  </tr>
  <tr>
    <td width="50%">&nbsp;</td>
    <td><input type='button' id='submit' name='submit' value='<?php echo $this->_translate->_('User.AuthorizeNet.Main','Submit');?>' onclick="processRequest()"></td>
  </tr>
</table>
<br/>
<br/>
<div id="RM_card_proccessing_error_msg" style="display:none;"></div>
<div id="RM_cancel_order_msg" style="display:none;">
    <a href="<?php echo RM_Environment::getInstance()->getRouter()->_('AuthorizeNet', 'cancel'); ?>"><?php echo $this->_translate->_('User.AuthorizeNet.Main','Cancel');?></a>
</div>
<div id="RM_payment_processing_message_area" style="display:none;">
    <table width="200" border="0" align="center">
        <tr>
            <td nowrap>
                <?php echo $this->_translate->_('User.AuthorizeNet.Main','Processing');?><br/>
                <img src="<?php echo RM_Environment::getConnector()->getRootURL(); ?>/RM/userdata/plugins/AuthorizeNet/views/user/scripts/AuthorizeNet/processing.gif" border="0">
            </td>
        </tr>
    </table>
</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
